<template>
<!-- <div>
    <textarea placeholder="自我介绍" v-model.lazy="words"></textarea>
</div>
<div>
    <select v-model="city">
        <option value="BZ">北京</option>
        <option value="SH">上海</option>
        <option value="SZ">深圳</option>
        <option value="GZ">广州</option>
        <option value="NC">南昌</option>
        <option value="HZ">杭州</option>
    </select>
    <input type="radio" value="a" v-model="word">A
    <input type="radio" value="b"v-model="word">B
    <input type="radio" value="c"v-model="word">C
    <input type="radio" value="d"v-model="word">D
    <input type="radio" value="e"v-model="word">E
    <div>
        <input type="checkbox" value="1" v-model="sect">
        <input type="checkbox" value="2" v-model="sect">
        <input type="checkbox" value="3" v-model="sect">
        <input type="checkbox" value="4" v-model="sect">
        <input type="checkbox" value="5" v-model="sect">

    </div>
</div> -->
<!-- <div>
    <select v-model="sect">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="1">6</option>
        <option value="1">7</option>
    </select>
</div>
<div>
    <input type="radio" value="1" v-model="rad">1
    <input type="radio" value="2" v-model="rad">2
    <input type="radio" value="3" v-model="rad">3
    <input type="radio" value="4" v-model="rad">4
    <input type="radio" value="5" v-model="rad">5<br>
    <input type="checkbox" value="1" v-model="cb">1
    <input type="checkbox" value="2" v-model="cb">2
    <input type="checkbox" value="3" v-model="cb">3
    <input type="checkbox" value="4" v-model="cb">4
    <input type="checkbox" value="5" v-model="cb">5
</div> -->
<!-- <div :class="{active:IS}">
    HELLO,WORLD
</div> -->
<!-- <div :class="IS?'active':''">
    HELLO,WORLD
</div> -->
<div :class="{active:IS}">
    HELLO,WORLD
</div>
</template>

<script setup>
    import { ref } from 'vue';
    let IS=ref(false);
</script>

<style scoped>
    .active{
        background-color: red;
    }
</style>